<template>

  <div class="container">
    <div class="header flex-derc-warp">
      <div class="return" @click="$router.back()"
           style="position: absolute;top:.7rem;left:1rem;width: 2rem;height: 2rem">
        <img src="static/img/return.png" width="100%" height="100%"/>
      </div>


      <div class="headImg flex-derc-warp flex-center-center">
        <div class="imgTou flex-derc-warp flex-center-center">
          <div style="width: 100%;text-align: center;font-size: 1.2rem;color:#435368;margin:.7rem 0rem 0rem 0rem;">更改密码</div>
         </div>
      </div>
    </div>
    <div style="width: 95%;margin:0.5rem auto 0rem auto">
      <mt-field label="密码提示 :"  disabled v-model="hint"></mt-field>
      <mt-field label="当前密码 :"  type="password"  v-model="oldpwd"></mt-field>
      <mt-field label="新密码 :"   type="password" v-model="pwd"></mt-field>
      <mt-field label="重复新密码 :"   type="password" v-model="rpwd"></mt-field>
    </div>


    <div style="width: 92%;margin:1.5rem auto 0.5rem auto;text-align: center">
      <mt-button style="width: 70%;" @click="updatePwd" type="primary">
        确定修改
      </mt-button>
    </div>

    <div style="width: 100%;font-size:.8rem;padding: 1rem;color:#c1c1c1;text-align: center">
      忘记密码 ? 导入助记词或私钥可重置密码。<span style="color:#1f72ff" @click="$router.push({name:'EthImportWallet'})">马上导入</span>
    </div>
    <!--<foot></foot>-->

  </div>

</template>

<script>


  import {mapGetters, mapActions} from 'vuex'
  import {Popup } from 'mint-ui'
  import {Dialog} from 'vant'

  export default {

    components: {
      Popup
    },
    data() {
      return {
        popupVisible: false,
        hint:'',
        oldpwd:'',
        pwd:'',
        rpwd:''
      }
    },
    computed: {
      ...mapGetters(['wallet','accountIndex','coinsList','currentAccount'])
    },
    created(){
      this.hint=this.currentAccount.hint?this.currentAccount.hint:'无'
    },
    methods: {
      ...mapActions(['setWallet','setAccountIndex','setCoinByIndex','setEthBalance','setEthPrice','setBalance','setWalletAccountByIndex']),
      updatePwd(){
        if(this.oldpwd==''){
          Dialog.alert({
            title: '提示',
            message: '请填写当前密码'
          }).then(() => {
            // on close
          });
          return;
        }

        if(this.pwd==''){
          Dialog.alert({
            title: '提示',
            message: '请填写新密码'
          }).then(() => {
            // on close
          });
          return;
        }

        if(this.pwd.length<6){
          Dialog.alert({
            title: '提示',
            message: '新密码长度需大于等于6位'
          }).then(() => {
            // on close
          });
          return;
        }



        if(this.rpwd==''){
          Dialog.alert({
            title: '提示',
            message: '请再次填写新密码'
          }).then(() => {
            // on close
          });
          return;
        }

        if(this.pwd!=this.rpwd){
          Dialog.alert({
            title: '提示',
            message: '两次密码不一致'
          }).then(() => {
            // on close
          });
          return;
        }

        if(this.pwd.length<6||this.rpwd.length<6){
          Dialog.alert({
            title: '提示',
            message: '新密码长度需大于等于8位'
          }).then(() => {
            // on close
          });
          return;
        }



        if(this.oldpwd!=this.currentAccount.password){
          Dialog.alert({
            title: '提示',
            message: '当前密码有误'
          }).then(() => {
            // on close
          });
          return;
        }

        else{
          this.currentAccount.password=this.pwd;
          this.setWalletAccountByIndex(this.currentAccount,this.accountIndex)
          let _this=this
          Dialog.alert({
            title: '提示',
            message: '修改密码成功'
          }).then(() => {
            _this.$router.back()
          });

        }
      }
    },
    async mounted() {

    }
  }
</script>
<style scoped>
  @import url("../../../assets/css/updatePwd.css");


</style>

